<template>
	<view class="machine container myMachine" v-if="showPage">
		<!-- style="height: 100vh;" -->
		<view class="w100 pb10 bgF fixhead"><u-tabs bar-width="70" :list="list" :is-scroll="false" :current="current" @change="tabsChange"></u-tabs></view>
		<view class="w100" style="height: 92rpx;"></view>

		<view class="container" style="height: 1px;"></view>
		<!-- 我的矿机 -->
		<view v-if="current == 0">
			<view v-if="machineryList.length > 0">
				<view class="container flex-spc-x bgF  pt20 pb20 mb20" v-for="(item, index) in machineryList" v-bind:key="index">
					<view class="w50 flex-xy"><image :src="item.sysMachinery.url" mode="widthFix" class="w70"></image></view>
					<view class="w50">
						<view class="co056 fs34 pb10">{{ item.sysMachinery.name }}</view>
						<view class="fs28 pb10">收益金额：{{ item.sysMachinery.output }}矿币</view>
						<view class="fs28 pb10">算力：{{ item.sysMachinery.power }}</view>
						<view class="fs28 pb10">收益时间：{{ item.maturity }}</view>
						<view class="fs28 pb10">运行时间：{{ item.sysMachinery.period }} 分钟</view>
					</view>
				</view>

				<view class="container  mt20" style="background: #f3f3f3;"><u-divider color="#CCC" bg-color="#f3f3f3">~到底了,宝贝~</u-divider></view>
			</view>

			<view v-else class="container flex-xy">
				<view class="w100" style="height: 92rpx;"></view>
				<image src="../../static/noMsg.png" mode="widthFix" style="width: 60%;" class="pt50"></image>
			</view>
		</view>
		<!-- 我的 矿机加速器  -->
		<view v-if="current == 1">
			<view v-if="speedList.length > 0">
				<view class="container flex-spc-x bgF  pt20 pb20 mb20" v-for="(item, index) in speedList" v-bind:key="index">
					<view class="w50 flex-xy"><image :src="item.sysSpeed.url" mode="widthFix" class="w70"></image></view>
					<view class="w50">
						<view class="co056 fs34 pb10">{{ item.sysSpeed.name }}</view>
						<view class="fs28 pb10">运行时间：{{ item.sysSpeed.time }} 分钟</view>
						<view class="fs28 pb10">适用矿机：{{ item.sysSpeed.machineryName }}</view>
						<u-button type="primary" :ripple="true" size="mini" @click="byMachine(index)">立即加速</u-button>
					</view>
				</view>

				<view class="container  mt20" style="background: #f3f3f3;"><u-divider color="#CCC" bg-color="#f3f3f3">~到底了,宝贝~</u-divider></view>
			</view>

			<view v-else class="container flex-xy">
				<view class="w100" style="height: 92rpx;"></view>
				<image src="../../static/noMsg.png" mode="widthFix" style="width: 60%;" class="pt50"></image>
			</view>
		</view>

		<view class="w100" style="height: 90rpx;"></view>
		<!-- <u-modal v-model="show" width="70%" title="确定加速" show-cancel-button @confirm="inputConfirm" @cancel="inputCancel"><view class="slot-content mt30 mb30"></view></u-modal> -->
		<u-select v-model="showSelect" mode="single-column" :list="allList" @confirm="inputConfirm"></u-select>
	</view>
</template>

<script>
export default {
	data() {
		return {
			index: null, //第几个加速器
			show: false, //模态框
			showSelect: false, //多选框框
			allList:[],
			showPage: false, //没有登录不显示内容
			list: [
				{
					name: '我的矿机'
				},
				{
					name: '我的加速器'
				}
			],
			// 因为内部的滑动机制限制，请将tabs组件和swiper组件的current用不同变量赋值
			current: 0, // tabs组件的current值，表示当前活动的tab选项
			swiperCurrent: 0, // swiper组件的current值，表示当前那个swiper-item是活动的

			pageSize: 5, //每页数量
			pageNum: 1, //页码
			machineryList: [], // 矿机列表
			speedList: [] // 矿机加速器列表
		};
	},
	methods: {
		// 购买矿机 显示模态框
		byMachine(index) {
			this.showSelect = true;
			this.index = index;
		},
		// 确定加速
		inputConfirm(e) {
			// console.log(e);
			// 		PUT/mobileUser/UserMachinery/useSpeed矿机加速
			// {
			//   "userId": "1",
			//   "userMachineryId": 1290944298078048256,
			//   "userSpeedId": 1
			// }

			if(!!e[0].value){
				let getObj = {
						url: '/mobileUser/UserMachinery/useSpeed',
						data: {
							userId: uni.getStorageSync('y-userId'),
							userMachineryId: e[0].value,
							userSpeedId: this.speedList[this.index].userSpeedId
						}
					};
					this.putRequest(getObj)
						.then(res => {
							if (res.data.code == 200) {
								uni.showToast({
									title: res.data.msg,
									mask: true,
									icon: 'none',
									duration: 500
								});
							} else {
								uni.showToast({
									title: res.data.msg,
									mask: true,
									icon: 'none',
									duration: 500
								});
							}
						})
						.catch(err => {});
					this.showSelect = false;

			}else{
				uni.showToast({
					title: "未选择矿机",
					mask: true,
					icon: 'none',
					duration: 500
				});
			}
		},
		// 取消加速
		inputCancel() {
			this.showSelect = false;
		},
		// 重置两个数组 页码
		reset() {
			this.machineryList = [];
			this.speedList = [];
			this.pageSize = 5; //每页数量
			this.pageNum = 1; //页码
		},
		// tabs通知swiper切换
		tabsChange(index) {
			this.current = index;
			this.reset(); //重置清空
			if (this.current == 0) {
				this.getMachineryList();
			}
			if (this.current == 1) {
				this.getSpeedList();
			}
		},

		// GET/mobileUser/UserMachinery/list查询我的矿机
		getMachineryList() {
			var postObj = { url: '/mobileUser/UserMachinery/list', data: { userId: uni.getStorageSync('y-userId'), pageNum: this.pageNum, pageSize: this.pageSize } };
			this.getRequest(postObj)
				.then(res => {
					// console.log('res查询我的矿机', res);
					if (res.data.code == 200) {
						if (res.data.rows.length > 0) {
							res.data.rows.forEach((items, i) => {
								items.sysMachinery.url = '/dev' + items.sysMachinery.url;
							});
						}
						this.machineryList = [...this.machineryList, ...res.data.rows];
					}
				})
				.catch(err => {
					// console.log('err查询我的矿机', err);
				});
		},

		// GET/mobileUser/UserSpeed/list查询矿机加速器列表
		getSpeedList() {
			var postObj = { url: '/mobileUser/UserSpeed/list', data: { userId: uni.getStorageSync('y-userId'), pageNum: this.pageNum, pageSize: this.pageSize } };
			this.getRequest(postObj)
				.then(res => {
					// console.log('res查询矿机加速器列表', res);
					if (res.data.code == 200) {
						if (res.data.rows.length > 0) {
							res.data.rows.forEach((items, i) => {
								items.sysSpeed.url = '/dev' + items.sysSpeed.url;
							});
						}
						this.speedList = [...this.speedList, ...res.data.rows];
					}
				})
				.catch(err => {
					// console.log('err查询矿机加速器列表', err);
				});



				// 查询我的所有矿机作为select
				var postObj = { url: '/mobileUser/UserMachinery/list', data: { userId: uni.getStorageSync('y-userId') } };
				this.getRequest(postObj)
					.then(res => {
						// console.log('res查询我的所有矿机', res);
						if (res.data.code == 200) {
							var allList = []
							if (res.data.rows.length > 0) {
								res.data.rows.forEach((items,i)=>{
									var obj={
										value: items.userMachineryId,
										label: `${items.sysMachinery.name }/${items.maturity}收获`
									}
									allList.push(obj)
								})
							}
							this.allList=allList
						}
					})
					.catch(err => {
						// console.log('err查询我的所有矿机', err);
					});
		}
	},
	onLoad(options) {
		if (this.judgeLoading(options)) {
			this.showPage = true;
		}
	},
	onShow() {
		if (this.showPage) {
			this.machineryList= [], // 矿机列表
			this.speedList= [] // 矿机加速器列表
			this.pageNum=1, //页码
			this.current = 0;
			if (this.current == 0) this.getMachineryList(); // 查询矿机列表  全部矿机可购买
			if (this.current == 1) this.getSpeedList(); // 查询矿机加速器列表
		}
	},
	// 触底事件
	onReachBottom() {
		if (this.current == 0) {
			this.pageNum += 1;
			this.getMachineryList();
		}
		if (this.current == 1) {
			this.pageNum += 1;
			this.getSpeedList();
		}
	}
};
</script>

<style lang="scss" scoped>
.fixhead {
	position: fixed;
	left: 0;
	top: 0;
	z-index: 9999;
}
</style>
